<template>
    <div class="loading_wp">
        <img v-if="isActive == 1" src="@/assets/img/fengmian/939.png" alt="">
        <!-- <img v-if="isActive == 2" src="@/assets/img/fengmian/941.png" alt=""> -->
        <img v-if="isActive == 2" src="@/assets/img/fengmian/splash.png" alt="">
        <div class="jin_du" v-if="progess">
            <div style="padding: 10px;">更新中...</div>
            <div> <el-progress :text-inside="true" :stroke-width="16" :percentage="progess" />
            </div>
        </div>
        <span v-else>正在读取码表文件 . . .</span>
    </div>
</template>

<script setup>
import { ref } from 'vue'
const isActive = ref(Math.floor(Math.random() * 2) + 1)
const { ipcRenderer } = require('electron');
const progess = ref(0)
ipcRenderer.on('downloadEvent', (e, v) => {
    progess.value = parseInt(v.percent)
})
</script>

<style scoped lang="less">
.loading_wp {
    background-color: #fff;
    width: 660px;
    height: 360px;
    overflow: hidden;
    position: relative;
    -webkit-app-region: drag;

    img {
        width: 660px;
        height: 285px;
    }

    span {
        color: #3875ad;
        position: absolute;
        left: 0;
        bottom: 0;
        padding: 10px 100px;
        word-spacing: 2px;
    }

    .jin_du {
        color: #3875ad;
        padding-top: 15px;
    }


}
</style>
